extends basic.pug
append vars
    -var stitle='城市概况'
append script
    script(src="script/city.js")
append style
    link(rel="stylesheet", href="style/city.css")
mixin header(title,content)
    .header01
        span.title=title
        span=content
block left
    +header("城市概况","CITY GENERALIZATION")
    .inoutcar
        .ioc-left
            p 进城车辆
            p.iocl-num 127,511
        img(src='../image/divideline.gif')
        .ioc-right
            p 进城车辆
            p.iocl-num 131,251
    .car-introduce
        p.ci-title
            | 市卡口车辆详情
        ul
            li
                span.ci-distance01 区名
                span.ci-distance02 进城方向
                span 出城方向
            li
                span.ci-distance01 建邺区
                span.ci-distance02 1875
                span 2597
            li
                span.ci-distance01 鼓楼区
                span.ci-distance02.cid-distance 2568
                span 1234
            li
                span.ci-distance01 栖霞区
                span.ci-distance02.cid-distance 365&nbsp;&nbsp;
                span 1571
            li
                span.ci-distance01 浦口区
                span.ci-distance02.cid-distance 7321
                span 3432
            li
                span.ci-distance01 雨花区
                span.ci-distance02.cid-distance 2340
                span 729
            li
                span.ci-distance01 江宁区
                span.ci-distance02.cid-distance 4230
                span 5324
            li
                span.ci-distance01 玄武区
                span.ci-distance02.cid-distance 132&nbsp;&nbsp;
                span 132
            li
                span.ci-distance01 秦淮区
                span.ci-distance02.cid-distance 2985
                span 1232
    +header("路况信息","TRAFFIC INFORMATION")
    .selected
        p.s-title
            | 当前选择
            span 鼓楼区华侨路
        ul
            li
                span.s-distance 08:12
                span 华侨路交接口发生追尾事故
            li
                span.s-distance 08:12
                span 华侨路交接口发生追尾事故
            li
                span.s-distance 08:12
                span 华侨路交接口发生追尾事故
            li
                span.s-distance 08:12
                span 华侨路交接口发生追尾事故
            li
                span.s-distance 08:12
                span 华侨路交接口发生追尾事故
            li
                span.s-distance 08:45
                span 事故处理完毕
            li
                span.s-distance 08:55
                span 交通状况良好
            li
                span.s-distance 09:05
                span 交通状况中 车流量较大，行车缓慢
            li
                span.s-distance 10:25
                span 华侨路发生追尾事故 交通堵塞
            li
                span.s-distance 10:55
                span 交通行驶缓慢
            li
                span.s-distance 11:20
                span 车流量较大，建议分流 交通堵塞
            li
                span.s-distance 11:50
                span 交通状况良好
            li
                span.s-distance 11:55
                span 发生追尾事故 交通堵塞
            li
                span.s-distance 11:20
                span 车流量较大，建议分流 交通堵塞
            li
                span.s-distance 11:50
                span 由北向南方向发生碰擦事故
            li
                span.s-distance 11:55
                span 交通状况良好
block middle
    .map
        //.map-pic
        .row.row1
        .row.row2
        .row.row3
        .row.row4
    .analyse
        ul
            li
                p.a-title 城市热力情况
                p.a-num
                    | 3/
                    span M
                        sup 2
                p.a-tip 人群密集度：高
            li
                p.a-title 车流量分析
                    p.a-num
                        | 258/
                        span MIN
                    p.a-tip 车辆密集度：高
            li
                p.a-title 道路分析
                    p.a-num
                        | 75/
                        span MIN
                    p.a-tip 道路标准承载量
            li
                p.a-title 警力部署
                    p.a-num
                        | 0.8/
                        span PERSON
                    p.a-tip 每平方千米执勤警察
    .nav
        ul
            li
                | 城市概括&nbsp;&nbsp;
                img(src='../image/nav01.gif')
            li
                | 交警执法&nbsp;&nbsp;
            li
                | 交通诱导&nbsp;&nbsp;
            li
                | 公共执行&nbsp;&nbsp;
block right
    +header("交通指数","TRAFFIC INDEX")
    .index
        #index01
        #index02
        #index03
        p
            span 交通指数
            span 拥堵等级
            span 平均车速
    +header("交通出行","TRAFFIC SITUATION")
    .situation
        #goout
        ul
            li
                span 587
                | 辆
            li
                span 1254
                | 辆
            li
                span 247
                | 辆
            li
                span 1265
                | 人
            li
                span 3574
                | 人
            li
                span 1567
                | 人
            li
                span 2565
                | 人
    +header("路况监控","TRAFFIC MONITOR")
    .monitor
        ul
            li
                dl
                    dt
                        img(src='../image/monitoe01.gif')
                    dd
                        | 中山南路淮海路南向北
            li
                dl
                    dt
                        img(src='../image/monitoe01.gif')
                    dd
                        | 中山南路淮海路南向北
        ul
            li
                dl
                    dt
                        img(src='../image/monitoe01.gif')
                    dd
                        | 中山南路淮海路南向北
            li
                dl
                    dt
                        img(src='../image/monitoe01.gif')
                    dd
                        | 中山南路淮海路南向北
        ul
            li
                dl
                    dt
                        img(src='../image/monitoe01.gif')
                    dd
                        | 中山南路淮海路南向北
            li
                dl
                    dt
                        img(src='../image/monitoe01.gif')
                    dd
                        | 中山南路淮海路南向北